<template>
  <div id="app">
    <router-view></router-view>
  </div>
</template>

<script lang="ts">
import { Component, Vue } from "vue-property-decorator";

@Component({
  components: {}
})
export default class App extends Vue {
  /** 生命周期 */
  created() {
    // 动态加载引用文件
    const files = this.$store.getters.getBaseData("files");
    const filesKeys = Object.keys(files);
    let heatStr = document.getElementsByTagName("head")[0].innerHTML;
    filesKeys.forEach(cur => {
      const src = files[cur];
      if (src && /\.css$/.test(src.toString())) {
        heatStr += `<link rel="stylesheet" href="${src}?v=${Date.now()}" />`;
      }
      if (src && /\.ico$/.test(src.toString())) {
        heatStr += `<link rel="icon" href="${src}">`;
      }
    });
    document.getElementsByTagName("head")[0].innerHTML = heatStr;
  }
}
</script>

<style lang="scss">
#app {
  font-family: "SourceHanSansCN-Normal", "Avenir", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #505050;
  font-size: 14px;
}
body {
  font-family: "SourceHanSansCN-Normal";
  font-size: 14px;
}
</style>
